<template>
	<span class="app-caption-bar">
		<span
			v-if="openType == 'MODAL'"
			:title="titlePSLanguageRes ? $t(titlePSLanguageRes) : title"
		>
			{{
				titlePSLanguageRes
					? $t(titlePSLanguageRes, title)
					: title
					? title
					: capPSLanguageRes
					? $t(capPSLanguageRes, caption)
					: caption
			}}
		</span>
		<span v-else>
			<span :title="titlePSLanguageRes ? $t(titlePSLanguageRes) : title">
				{{ capPSLanguageRes ? $t(capPSLanguageRes, caption) : caption }}
			</span>
			<span
				class="app-caption-bar__sub"
				v-if="subCapPSLanguageRes || subCaption"
			>
				- {{ subCapPSLanguageRes ? $t(subCapPSLanguageRes) : subCaption }}
			</span>
		</span>
	</span>
</template>

<script setup lang="ts">
import { CaptionBarProps } from './caption-bar';
const props = defineProps(CaptionBarProps);
</script>
